<html><head><title>ContainerLayout.js</title><link rel="stylesheet" type="text/css" href="../resources/style.css" media="screen"/></head><body><h1>ContainerLayout.js</h1><pre class="highlighted"><code><i>/**
 * @class Ext.layout.ContainerLayout
 * &lt;p&gt;Every {@link Ext.Container Container} delegates the rendering of its child {@link Ext.Component Component}s
 * to a layout manager class which must be {@link Ext.Container#layout configured} into the Container.&lt;/p&gt;
 * &lt;p&gt;Some layouts also provide sizing and positioning of child Components.&lt;/p&gt;
 * &lt;p&gt;The ContainerLayout class is the <b>default</b> layout manager used when no layout is configured into a Container.
 * It provides the basic foundation <b>for</b> all other layout classes <b>in</b> Ext. It simply renders all child Components
 * into the Container, performing no sizing or positioning services.&lt;/p&gt;
 * &lt;p&gt;This class is intended to be extended and should generally not need to be created directly via the <b>new</b> keyword.&lt;/p&gt;
 */</i>
Ext.layout.ContainerLayout = <b>function</b>(config){
    Ext.apply(<b>this</b>, config);
};

Ext.layout.ContainerLayout.prototype = {
    <i>/**
     * @cfg {String} extraCls
     * An optional extra CSS class that will be added to the container (defaults to <em>''</em>).  This can be useful <b>for</b>
     * adding customized styles to the container or any of its children using standard CSS rules.
     */</i>
<i>// holder</i>
<i>/***
     * @cfg {Boolean} renderHidden
     * True to hide each contained item on render (defaults to false).
     */</i>
<i>// holder</i>
<i>/***
     * A reference to the {@link Ext.Component} that is active.  For example,
     * <b>if</b>(myPanel.layout.activeItem.id == <em>'item-1'</em>) { ... }.  activeItem only applies to layout styles that can
     * display items one at a time (like {@link Ext.layout.Accordion}, {@link Ext.layout.CardLayout}
     * and {@link Ext.layout.FitLayout}).  Read-only.  Related to {@link Ext.Container#activeItem}.
     * @type {Ext.Component}
     * @property activeItem
     */</i>

    <i>// private</i>
    monitorResize:false,
    <i>// private</i>
    activeItem : null,

    <i>// private</i>
    layout : <b>function</b>(){
        <b>var</b> target = <b>this</b>.container.getLayoutTarget();
        <b>this</b>.onLayout(<b>this</b>.container, target);
        <b>this</b>.container.fireEvent(<em>'afterlayout'</em>, <b>this</b>.container, <b>this</b>);
    },

    <i>// private</i>
    onLayout : <b>function</b>(ct, target){
        <b>this</b>.renderAll(ct, target);
    },

    <i>// private</i>
    isValidParent : <b>function</b>(c, target){
		<b>var</b> el = c.getPositionEl ? c.getPositionEl() : c.getEl();
		<b>return</b> el.dom.parentNode == target.dom;
    },

    <i>// private</i>
    renderAll : <b>function</b>(ct, target){
        <b>var</b> items = ct.items.items;
        <b>for</b>(var i = 0, len = items.length; i &lt; len; i++) {
            <b>var</b> c = items[i];
            <b>if</b>(c &amp;&amp; (!c.rendered || !<b>this</b>.isValidParent(c, target))){
                <b>this</b>.renderItem(c, i, target);
            }
        }
    },

    <i>// private</i>
    renderItem : <b>function</b>(c, position, target){
        <b>if</b>(c &amp;&amp; !c.rendered){
            c.render(target, position);
            <b>if</b>(this.extraCls){
            	<b>var</b> t = c.getPositionEl ? c.getPositionEl() : c;
            	t.addClass(<b>this</b>.extraCls);
            }
            <b>if</b> (<b>this</b>.renderHidden &amp;&amp; c != <b>this</b>.activeItem) {
                c.hide();
            }
        }<b>else</b> if(c &amp;&amp; !<b>this</b>.isValidParent(c, target)){
            <b>if</b>(this.extraCls){
                <b>var</b> t = c.getPositionEl ? c.getPositionEl() : c;
            	t.addClass(<b>this</b>.extraCls);
            }
            <b>if</b>(typeof position == <em>'number'</em>){
                position = target.dom.childNodes[position];
            }
            target.dom.insertBefore(c.getEl().dom, position || null);
            <b>if</b> (<b>this</b>.renderHidden &amp;&amp; c != <b>this</b>.activeItem) {
                c.hide();
            }
        }
    },

    <i>// private</i>
    onResize: <b>function</b>(){
        <b>if</b>(this.container.collapsed){
            <b>return</b>;
        }
        <b>var</b> b = <b>this</b>.container.bufferResize;
        <b>if</b>(b){
            <b>if</b>(!<b>this</b>.resizeTask){
                <b>this</b>.resizeTask = <b>new</b> Ext.util.DelayedTask(<b>this</b>.layout, <b>this</b>);
                <b>this</b>.resizeBuffer = <b>typeof</b> b == <em>'number'</em> ? b : 100;
            }
            <b>this</b>.resizeTask.delay(<b>this</b>.resizeBuffer);
        }<b>else</b>{
            <b>this</b>.layout();
        }
    },

    <i>// private</i>
    setContainer : <b>function</b>(ct){
        <b>if</b>(this.monitorResize &amp;&amp; ct != <b>this</b>.container){
            <b>if</b>(this.container){
                <b>this</b>.container.un(<em>'resize'</em>, <b>this</b>.onResize, <b>this</b>);
            }
            <b>if</b>(ct){
                ct.on(<em>'resize'</em>, <b>this</b>.onResize, <b>this</b>);
            }
        }
        <b>this</b>.container = ct;
    },

    <i>// private</i>
    parseMargins : <b>function</b>(v){
        <b>var</b> ms = v.split(<em>' '</em>);
        <b>var</b> len = ms.length;
        <b>if</b>(len == 1){
            ms[1] = ms[0];
            ms[2] = ms[0];
            ms[3] = ms[0];
        }
        <b>if</b>(len == 2){
            ms[2] = ms[0];
            ms[3] = ms[1];
        }
        <b>return</b> {
            top:parseInt(ms[0], 10) || 0,
            right:parseInt(ms[1], 10) || 0,
            bottom:parseInt(ms[2], 10) || 0,
            left:parseInt(ms[3], 10) || 0
        };
    },

    <i>/*
     * Destroys <b>this</b> layout. This is a template method that is empty by <b>default</b>, but should be implemented
     * by subclasses that require explicit destruction to purge event handlers or remove DOM nodes.
     * @protected
     */</i>
    destroy : Ext.emptyFn
};
Ext.Container.LAYOUTS[<em>'auto'</em>] = Ext.layout.ContainerLayout;</code></pre><hr><div style="font-size:10px;text-align:center;color:gray;">Ext - Copyright &copy; 2006-2007 Ext JS, LLC<br />All rights reserved.</div>
    </body></html>